<template>
  <div class="w-full h-full flex-col flex-c-c">
    <h1>欢迎使用AI Chat System</h1>
    <div class="mb-24px">您当前{{}}登录，请选择卡片开始聊天</div>
    <el-row class="w-800px" :gutter="20">
      <el-col :span="12">
        <el-card class="h-full flex-col" body-class="flex-auto" header="直连ollama">
          <p class="pb-1rem">
            无需注册登录，通过直接连接位于本机或者网络中可以访问的ollama服务开始聊天。
          </p>
          <p class="pb-1rem">
            该方式需要在你的电脑上安装ollama，或在一个可安全访问的远程服务远程服务器上安装ollama。
          </p>
          <p class="pb-1rem text-tips">远程连接需要注意安全风险，并开放远程访问权限。</p>
          <template #footer>
            <el-button type="primary" @click="handleToDirect">点我</el-button>
          </template>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="h-full flex-col" body-class="flex-auto" header="系统内建">
          <p class="pb-1rem">需首先注册，并登录系统。</p>
          <p class="pb-1rem">
            登录后系统将能保留或删除了解记录。并且您可以创建多个智能体并为其配置不同的知识库以应对不同的对话需求。
          </p>
          <template #footer>
            <el-button type="primary" @click="handleSigIn">登录</el-button>
            <el-button type="primary" @click="handleSigUp">注册</el-button>
          </template>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'PageHome' })
const router = useRouter()
const handleToDirect = () => {
  router.push('/direct')
}
const handleSigIn = () => {
  ElMessage.info('敬请期待...')
}
const handleSigUp = () => {
  ElMessage.info('敬请期待...')
}
</script>
<style lang="scss"></style>
